package ;

import easelhx.display.Container;
import easelhx.display.MovieClip;
import easelhx.display.Shape;
import easelhx.display.Stage;
import easelhx.display.Text;
import easelhx.utils.Ticker;
import js.HTMLCanvasElement;
import js.Lib;
import tweenhx.Ease;
import tweenhx.Tween;

/**
 * ...
 * @author 
 */

class TweenExample extends Example
{
	//private var canvas:HTMLCanvasElement;
	//private var stage:Stage;

	public function new() 
	{
		super();
		//canvas = cast Lib.document.getElementById("testCanvas");
		//stage =  new Stage(canvas);
	}
	
	override public function run():Void 
	{
		// Create a new Text object:
		var text = new Text("Hello World!!!", "36px Arial", "#777");
		// add the text as a child of the stage. This means it will be drawn any time the stage is updated
		// and that it's transformations will be relative to the stage coordinates:
		stage.addChild(text);
		
		var circle:Shape = new Shape();
		circle.graphics.beginFill("#FF0000").drawCircle(0, 0, 50);
		stage.addChild(circle);
		
		Tween.get(circle, {loop:true}, true)
		.to({x:500,y:200,alpha:0.1},1000,Ease.get(1))
		.to( { x:0 }, 1000, Ease.get(-1))
		.to( { x:0, y:0, alpha:1 }, 5000, Ease.bounceInOut);
		
		// position the text on screen, relative to the stage coordinates:
		text.x = 360;
		text.y = 200;
		text.regX = 100;
		
		var txtContainer:Container = new Container();
		txtContainer.addChild(text);
		stage.addChild(txtContainer);
		
		Tween.get(text, { loop:true }, 2000)
		.to({rotation:180},1000)
		.to({rotation:0},1000);
		
		Ticker.setFPS(20);
		// in order for the stage to continue to redraw when the Ticker is paused we need to add it with
		// the second ("pauseable") param set to false.
		Ticker.addListener(stage,false);
	}
	
}